<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
	<head>
		<title>井冈山智慧社区</title>
		<%@ include file="../../common/Website-list.jsp"%>	
		<link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="<%=bpath%>Scripts/metisMenu/metisMenu.css"/>
		<link rel="stylesheet" type="text/css" href="<%=bpath%>Scripts/metisMenu/metisFolder.css"/>		
		<script type="text/javascript" src="<%=bpath%>Scripts/metisMenu/metisMenu.js"></script>				
		<script type="text/javascript" src="<%=bpath%>Scripts/jquery/jquery.form.js"></script>		
		<script type="text/javascript" src="<%=bpath%>Scripts/jquery/jquery.validate.min.js"></script>	
		<link rel="stylesheet" type="text/css" href="<%=bpath%>pages/WebSitePc/css/categoryMenu.css"/>		
		<link rel="stylesheet" type="text/css" href="<%=bpath%>pages/WebSitePc/css/publicInteract.css"/>	
		
		<script type="text/javascript" src="<%=bpath%>pages/WebSitePc/js/adviceAdd.js"></script>		
		
		<script type="text/javascript">
			
			$(function(){
				
				if('${data.siteMenuList}'!=null && ${data.siteMenuList.size()}>0){
					//获取第一个,顶部 
					var firstId='${data.siteMenuList.get(0).id}';
					var firstName='${data.siteMenuList.get(0).menuName}';
					var url='${data.siteMenuList.get(0).url}';					
					$olda='#nav'+firstId; //选中导航					
					
					var lastId='${data.siteMenuList.get(data.siteMenuList.size()-1).id}';
					
					getMenuLeft(firstId,firstName,url,lastId);		            
				}	
				
				
				$("#tableForm").validate({							
					rules: {						
						ad_name: {
							required: true,
							minlength: 2
						},
						ad_iDcards: {
							required: true,							
							isIdCardNo:true
						},
						ad_tel:{
							required:true,
							isMobile:true
						},						
						ad_email: {							
							email: true
						},
						ad_address:{
							required:true,							
							byteRangeLength:[3,100]
						},
						title: {
							required:true,							
						},
						contents:{
							required:true,							
							byteRangeLength:[20,2000]
						},
						randCode:{
							required:true,
							minlength: 4							
						} 
					},
					messages: {											
						ad_name: {
							required: "<font color=red><br/>请输入姓名！</font>",
							minlength: "<font color=red><br/>用户名必须2个中文字符！</font>"
						},
						ad_iDcards:{
							required:"<font color=red><br/>请输入身份证号</font>",
							isIdCardNo:"<font color=red><br/>请输入正确的身份证号</font>"
						},
						ad_tel:{
							required: "<font color=red><br/>请输入您的联系电话</font>",
							isPhone: "<font color=red><br/>请输入一个有效的联系电话</font>"
						},
						ad_email:{							
							email: "<font color=red><br/>请输入一个有效的Email地址</font>"
						},	
						ad_address:{
							required: "<font color=red><br/>请输入您的联系地址</font>",							
							byteRangeLength: "<font color=red><br/>请详实您的联系地址以便于我们联系您</font>"
						},
						title: {
							required:"<font color=red><br/>请输入主题</font>"							
						},
						contents:{
							required:"<font color=red><br/>请输入内容</font>",							
							byteRangeLength:"<font color=red><br/>内容在10到2000之间字</font>"
						},
						randCode:{
							required:"<font color=red>请输入验证码</font>",
							minlength: "<font color=red>验证码少于4位</font>"							
						} 
					},							
				 	submitHandler: function (form) {
				 		$('#polluteArea').val($("#polluteType").find("option:selected").text());
				 		var url = $ctx+"/SiteIndex/adviceAdd.json";
				 		$(form).ajaxSubmit({
								type:"post",
								dataType:"json",
							    url:url,		
								contentType:"application/x-www-form-urlencoded;charset=UTF-8",
								error:function(){},
								success:function(data){
									if(data!=null){
										$('.hudongmain').css("display","none");
										$('#tips').css("display","block");
										$('#searcher').html(data.searchId);	
										
										//if(data.success){
											//$('.hudongmain').css("display","none");
											//$('#tips').css("display","block");
											//$('#searcher').html(data.searchId);											
											// location.href ="http://localhost:8080/HBJ-Web/"; 
										//}else{
											//alert("保存失败,"+data.error);
										//}
										
									}				
									
								}
						 });
			        }
				});
				

				
			});		
			  			
		</script>
		
	</head>
<body>
	<!--Header Holder-->
	<jsp:include page="../../WebSitePc/heads.jsp" />
	
	<!--main start-->	
	<div class="main">
		<div class="cate01">
			<div class="crumbs">
				您现在位置：<a href="<%=basePath%>" target="_self">首页</a> &gt;				
                <c:if test= "${data.siteMenuList.size()>0}" >
                    <c:forEach items= "${data.siteMenuList}" var ="tf" varStatus = "st">           
                    	<c:if test="${!st.last}">     						
     						<a href = "<%=basePath%>${tf.url}" target = "_self" class= "" >${tf.menuName} </a > &gt;
     					</c:if>       
     					<c:if test="${st.last}">
     						<a href = "<%=basePath%>${tf.url}" target = "_self" class= "" >
     						<font color="#2c95b7">${tf.menuName}</font></a >
     					</c:if>    
                    </c:forEach >
                </c:if >         
			</div>			
			<div class="cebox">
      			<div class="boxLeft">
      				<aside class="sidebar">
			      		<nav class="sidebar-nav">
			        		<ul id="menuLeft" class="metismenu">
			        			<!-- 左侧 树 菜单  -->
			        		</ul>
			      		</nav>
			    	</aside>
				</div>
				
				<!-- 右侧  咨询留言 正文-->							
				<div class="hudongmain">
					<!--温馨提醒-->		
					<div class="mailinfo">
						<div class="mailbt" >温馨提示</div>
						<div class="mailinfocon">
							<p>欢迎您使用
							<c:if test= "${data.typeId!=null && data.typeId==0}" >
								"咨询留言"
							</c:if>
							<c:if test= "${data.typeId!=null && data.typeId==1}" >
								"污染投诉"
							</c:if>
							了解并遵循以下基本注意事项:</p>
							<ol type="1" >
								<li>请录入准确的姓名、手机、邮件信息，便于工作人员答复您的问题。</li>
								<li>请录入详细的主题及内容，便于工作人员解决问题。</li>
								<li>您的个人信息将会得到切实的保护。</li>
								<li>注：<font color="red">* </font>为必填项。</li>
							</ol>						    
					    </div>
					</div>
					<!--个人信息-->		
					<form id="tableForm" name="curForm" method="post" action="<%=basePath%>/SiteIndex/adviceAdd.json">
					<div class="mailinfo">
						<div class="mailbt">来信人信息</div>
					    <div class="mailinfocon">					   
					    	<table width="100%" cellspacing="0" cellpadding="0" border="0">
					  		<tbody>
					  			<tr>
					    			<td width="10%" height="38" class="tdRight">姓名：</td>
					    			<td width="35%">
					    				<input type="text" size="20" id="ad_name" name="ad_name" placeholder="请输入姓名" />
					    				<span class="redtext2">*</span>
					    			</td>
					    			<td width="10%" class="tdRight">
					    				身份证：
					    			</td>
					    			<td width="35%">
					    				<input type="text" id="ad_iDcards" name="ad_iDcards" placeholder="请输入正确身份证号" />
					    				<span class="redtext2">*</span>
					    			</td>				    			
					  			</tr>
								<tr>
								    <td class="tdRight">手机号码：</td>
								    <td>
								    	<input type="text" id="ad_tel" name="ad_tel" placeholder="请输入手机号码" />
								    	<span class="redtext2">*</span>
								    </td>
								    <td class="tdRight">电子邮箱：</td>
					    			<td>
					    				<input type="text" maxlength="50" id="ad_email" name="ad_email" placeholder="请输入邮箱" />
					    			</td>							   
								</tr>					  			
					  			<tr>
					    			<td class="tdRight">通讯地址：</td>				    			
					    			<td colspan="3">
					    				<input type="text" size="132"  id="ad_address" name="ad_address"  placeholder="请输入详细地址" />					    				  
					    				<span class="redtext2">*</span>
					    			</td>
					  			</tr>
								</tbody>
								</table>
					      
					      	</div>
				    	</div>
					
						<div class="mailinfo">
					    	<div class="mailbt">内容填写</div>
					      	<div class="mailinfocon">					
					      		<table width="100%" cellspacing="0" cellpadding="0" border="0">
					  			<tbody>
					  				<tr>
					    				<td width="11%" height="38" class="tdRight">主      题 ：</td>
					    				<td>
					    					<input type="text" name="title" placeholder="请输入主题" />
					    					<span class="redtext2">*</span>
					    					<input name="typeId" id="typeId" type="hidden" value='${data.typeId}' />					    					
					    				</td>	
					  				</tr>	
					  				<c:if test= "${data.typeId!=null && data.typeId==1}" >
					  				<tr>
					    				<td width="11%" height="38" class="tdRight">污染类型 ：</td>
					    				<td>
					    					<select id="polluteType" name="polluteType" class="mailselect">
                   			                    <option value="0102" selected="selected">大气污染</option>
					                            <option value="0101">水污染</option>												
												<option value="0103">固体废物</option>
												<option value="0104">噪声污染</option>
												<option value="0105">危险化学品</option>
												<option value="0106">放射性污染</option> 
												<option value="0107">电磁辐射</option>
												<option value="0108">三产污染</option>
												<option value="0109">生态破坏</option>
												<option value="0110">畜牧、农药化肥污染</option> 
												<option value="0111">其他污染</option>
					                        </select>    	
					                        <input name="polluteArea" id="polluteArea" type="hidden" value='大气污染' />				
					    				</td>	
					  				</tr>					  				
					  				</c:if>
					  								  				
									<tr>
										<c:if test= "${data.typeId!=null && data.typeId==0}" >
										<td height="90" class="tdRight" valign="top">咨询内容 ：</td>
										</c:if>
										<c:if test= "${data.typeId!=null && data.typeId==1}" >
										<td height="90" class="tdRight" valign="top">投诉内容 ：</td>
										</c:if>
									    <td>
									    	<textarea id="contents" name="contents" class="mailtextarea" rows="4" cols="100" placeholder="请输入内容" ></textarea>
									    	<span class="redtext2">*</span>
									    </td>
									</tr>	
									<tr>					  				
					    				<td height="38" class="tdRight">是否公开：</td>
					    				<td>
											<input type="radio" checked="checked" value="1" name="is_publish_ad" class="mailradio" />公开
					                         &nbsp;&nbsp;&nbsp;
					      					<input type="radio" value="0" name="is_publish_ad" class="mailradio" />不公开						      									      					
										</td>
					  				</tr>
					  				<tr>					  				
					    				<td height="38" class="tdRight">验证码：</td>
					    				<td>					    		
					    					<input id="randCode" style="width:80px;" type="text" name="randCode" placeholder="请输入验证码" />			
											<span class="redtext2">*</span>
																					 
											 <img id="validatImg" alt="验证码" src="<%=basePath%>webcode.htm" />	
											 <a href="javascript:void(0);" onclick="changeImage();">看不清，换一张</a> 
										</td>
					  				</tr>		  								
					  				<tr>					  					
					  					<td colspan="2" height="52" style="text-align:center;">
					  						<input type="submit" value="提&nbsp;&nbsp;交" class="mailbtn" />
					  					</td>
					  				</tr>
								</tbody>
								</table>
								
						      </div>
					    </div>
					</form>
							
				</div>	
			
				<!-- 保存成功的提示 -->
				<div id="tips">
					提交成功！请保存查询号<span id="searcher"></span> 用于查询！					
				</div>				
			</div>
					
		</div>
	</div>
	<script type="text/javascript">
		//通过 导航  生成菜单	
		$(function () {    		
			$('#menuLeft').metisMenu({doubleTapToGo: true });
		});
	</script>
	<!--foot start-->
	<jsp:include page="../../WebSitePc/footer.jsp" />	
</body>
</html>